<template>
	<view class="container">
		<view class="homeBg">
			<view class="title">转让</view>
			<!-- @tap="navTo('/pages/transaction/statistics')" -->
			<image src="../../static/home/transaction.png" mode="widthFix" class="searchIcon" @tap="goStatusics">
			</image>
		</view>
		<view class="transaction-info" v-if="tabBoxList.length>0">
			<view class="info-left">
				<view class="ball-name">
					<view style="display: flex;align-items: center;" @tap="selectBill"><text
							style="margin-right: 10upx;">{{billName||'暂无积分信息'}}</text>
						<u-icon name="arrow-down" color="#000" size="16"></u-icon>
					</view>
					<view class="">({{billCode}})</view>
				</view>
				<view class="submit-form">
					<view class="submit-btn btn1" @tap="entrustedTransfer(1)">转让</view>
					<view class="submit-btn btn2" @tap="entrustedTransfer(0)">受让</view>
				</view>
				<view v-if="tabBoxIndex == 1">
					<view class="label">当前持有积分总数</view>
					<view class="label-input">
						<view class="left-input input-view">
							<view class="">可用:{{hotNumber||0.00}}</view>
							<view class="">冻结:{{coldNumber||0.00}}</view>
						</view>
					</view>
				</view>
				<view v-else>
					<view class="label">当前账户余额</view>
					<view class="label-input">
						<view class="left-input input-view">
							<view class="">可用:{{userAccount.hotMoney||0.00}}</view>
							<view class="">冻结:{{userAccount.coldMoney||0.00}}</view>
						</view>
					</view>
				</view>
				<view class="label">委托价格（{{showFixPriceCoin||'CNY'}}）</view>
				<view class="label-input">
					<view class="left-input">
						<input type="number" v-model="price" class="input-box" placeholder="0.00"
							placeholder-class="inputStyle" @input="enterAmountChange">
					</view>
					<view class="jian" @tap="reduce(2)">
						<image src="../../static/common/jian.png" mode="widthFix" class="img"></image>
					</view>
					<view class="jia" @tap="plus(2)">
						<image src="../../static/common/jia.png" mode="widthFix" class="img"></image>
					</view>
				</view>
				<view class="label">数量</view>
				<view class="label-input">
					<view class="left-input">
						<input type="number" v-model="num" class="input-box" placeholder="0"
							placeholder-class="inputStyle" @input="currentSelect=null">
					</view>
				</view>
				<!-- 步骤条选择 -->
				<u-steps :current="currentSelect" dot style="display:flex;margin-top:10upx">
					<view @tap="changeCurrentSelect(0,0)" style="flex:1">
						<u-steps-item desc="0%"></u-steps-item>
					</view>
					<view @tap="changeCurrentSelect(1,0.25)" style="flex:1">
						<u-steps-item desc="25%"></u-steps-item>
					</view>
					<view @tap="changeCurrentSelect(2,0.5)" style="flex:1">
						<u-steps-item desc="50%"></u-steps-item>
					</view>
					<view @tap="changeCurrentSelect(3,0.75)" style="flex:1">
						<u-steps-item desc="75%"></u-steps-item>
					</view>
					<view @tap="changeCurrentSelect(4,1)" style="flex:1">
						<u-steps-item desc="100%"></u-steps-item>
					</view>
				</u-steps>
				<view class="sales-total-box">
					<view class="totalAmount">
						<view>总金额:</view>
						<view>{{totalAmount}}</view>
					</view>
					<view class="handlingFee">
						<view>手续费:</view>
						<view>{{handlingFee}}</view>
					</view>
				</view>
				<view :class="tabBoxIndex == 1 ? 'submit-btn2':'submit-btn1'" @tap="submitFn">
					{{tabBoxIndex == 1 ? '转让' : '受让'}}
				</view>
			</view>
			<view class="info-right">
				<view class="header" label-input>
					<view class="">价格({{showFixPriceCoin||'CNY'}})</view>
					<view class="">数量</view>
				</view>
				<!--  v-if="echartsInfoList.length>0" -->
				<view class="list">
					<view class="list-item" v-for="(item,index) in 6-echartsInfoList.length" :key="item[0]">
						<view class="">--</view>
						<view class="">--</view>
					</view>
					<view class="list-item" v-for="(item,index) in echartsInfoList" :key="item[0]">
						<view class="" style="color:red" @touchend="maskTouchend(item[0].toFixed(2)||'--')">
							{{item[0].toFixed(2)||'--'}}
						</view>
						<view class="" style="color:red">{{item[1]||'--'}}</view>
					</view>
					<view class="list-item">
						<view class="">最新价格({{priceNew.toFixed(2)}})</view>
					</view>
					<view class="list-item" v-for="(item,index) in priceNewList" :key="index">
						<view class="" style="color:green" @touchend="maskTouchend(item[0].toFixed(2)||'--')">
							{{item[0].toFixed(2)||'--'}}</view>
						<view class="" style="color:green">{{item[1]||'--'}}</view>
					</view>
					<view class="list-item" v-for="(item,index) in 6-priceNewList.length" :key="item[0]">
						<view class="">--</view>
						<view class="">--</view>
					</view>
				</view>
				<!-- 				<view v-else class="noListBox">
					<view class="noData">
						<image class="noDataImg" src="../../static/home/noData.png" mode=""></image>
						<view class="text">暂无数据</view>
					</view>
				</view> -->
			</view>
		</view>
		<view class="tabBox" v-if="true">
			<view class="">
				<view :class="swiperCurrent == 0?'activeClass':'defaultClass'" @tap="changeCurrent(0)">当前委托</view>
				<view :class="swiperCurrent == 1?'activeClass':'defaultClass'" @tap="changeCurrent(1)">历史委托</view>
			</view>
			<!-- 			<view class="" @tap="goHistoryList">
				<view style="margin-right: 6upx;">更多</view>
				<image src="../../static/common/rightJiantou.png" mode="widthFix" style="width: 12upx;"></image>
			</view> -->
		</view>
		<view class="goods_list">
			<!-- -->
			<view class="listCentent" v-if="swiperCurrent == 0&& entrustList.length>0">
				<!-- <view class="list-item" v-for="(item,index) in entrustList" :key="index"> -->
				<view class="list-item" v-for="(item,index) in entrustListPart" :key="index">
					<view class="left-line" v-if="item.type == 1"></view>
					<view class="left-line one" v-else></view>
					<view class="flex">
						<view class="">积分代码:{{billCode}}</view>
						<view class="">委托价格:{{item.entrustPrice}}元/个</view>
					</view>
					<view class="flex">
						<view class="">积分名称:{{billName}}</view>
						<view class="">委托总额:{{(item.entrustPrice*item.entrustCount).toFixed(2)}}元</view>
					</view>
					<view class="flex">
						<view class="">委托量:{{item.entrustCount}}个</view>
						<view class="" v-if="swiperCurrent == 1">手续费:{{(item.transactionFee).toFixed(2)}}元</view>
						<view class="" v-else>转让类型: <text  :style="item.type == '1'?'color:green':'color:red'">{{item.type == '1'?'受让':'转让'}}</text></view>
					</view>
					<view class="flex">
						<view class="">转让状态：<text>{{statusFilter(item.status)}}</text></view>
						<view class="">成交数量：<text>{{ minus(item.entrustCount,item.surplusEntrustCount)}}</text></view>
					</view>
					<view class="flex" v-if="swiperCurrent == 1">
						<view class="">转让类型:<text  :style="item.type == '1'?'color:green':'color:red'">{{item.type == '1'?'受让':'转让'}}</text></view>
					</view>
					<view class="date">{{moment(item.entrustTime).format('YYYY/MM/DD HH:mm:ss')}}</view>
					<view class="cancelOrder" @tap="cancelOrder(item)">撤单</view>
				</view>
				<view class="msg" v-if="isEnd&&entrustList.length>0">
					<image src="../../static/home/line.png" mode="widthFix" class="left-line"></image>
					<text class="text">没有更多内容啦</text>
					<image src="../../static/home/line.png" mode="widthFix" class="right-line"></image>
				</view>
			</view>
			<view class="listCentent" v-else-if="swiperCurrent == 1 && entrustList1.length>0">
				<view class="list-item" v-for="(item,index) in entrustListPart1" :key="index">
					<view class="left-line" v-if="item.type == 1"></view>
					<view class="left-line one" v-else></view>
					<view class="flex">
						<view class="">积分代码:{{billCode}}</view>
						<view class="">委托价格:{{item.entrustPrice}}元/个</view>
					</view>
					<view class="flex">
						<view class="">积分名称:{{billName}}</view>
						<view class="">委托总额:{{(item.entrustPrice*item.entrustCount).toFixed(2)}}元</view>
					</view>
					<view class="flex">
						<view class="">委托量:{{item.entrustCount}}个</view>
						<view class="" v-if="swiperCurrent == 1">手续费:{{(item.transactionFee).toFixed(2)}}元</view>
						<view class="" v-else>转让类型:<text  :style="item.type == '1'?'color:green':'color:red'">{{item.type == '1'?'受让':'转让'}}</text></view>
					</view>
					<view class="flex">
						<view class="">转让状态：<text>{{statusFilter(item.status)}}</text></view>
						<view class="">成交数量：<text>{{item.entrustCount - item.surplusEntrustCount}}</text></view>
					</view>
					<view class="flex" v-if="swiperCurrent == 1">
						<view class="">转让类型:<text  :style="item.type == '1'?'color:green':'color:red'">{{item.type == '1'?'受让':'转让'}}</text></view>
					</view>
					<view class="date">{{moment(item.entrustTime).format('YYYY/MM/DD HH:mm:ss')}}</view>
				</view>
				<view class="msg" v-if="isEnd&&entrustList.length>0">
					<image src="../../static/home/line.png" mode="widthFix" class="left-line"></image>
					<text class="text">没有更多内容啦</text>
					<image src="../../static/home/line.png" mode="widthFix" class="right-line"></image>
				</view>
				<view class="msg" v-if="isEnd&&entrustList1.length>0&&swiperCurrent == 1">
					<image src="../../static/home/line.png" mode="widthFix" class="left-line"></image>
					<text class="text">没有更多内容啦</text>
					<image src="../../static/home/line.png" mode="widthFix" class="right-line"></image>
				</view>
			</view>
			<view v-show="entrustList.length == 0&&swiperCurrent == 0" class="noListBox">
				<view class="noData">
					<image class="noDataImg" src="../../static/home/noData.png" mode=""></image>
					<view class="text">暂无数据</view>
				</view>
			</view>
			<view v-show="entrustList1.length == 0&&swiperCurrent == 1" class="noListBox">
				<view class="noData">
					<image class="noDataImg" src="../../static/home/noData.png" mode=""></image>
					<view class="text">暂无数据</view>
				</view>
			</view>
		</view>
		<view class="account" v-if="openAccountShow">
			<u-popup :show="openAccountShow" mode="center" @close="closePay">
				<view class="openAccountBox">
					<view class="title">未完成实名认证</view>
					<view class="bottom_btn">
						<view class="btn_item lineBtn" @tap="closePay">取消</view>
						<view class="btn_item" @tap="goAccount">去认证</view>
					</view>
				</view>
			</u-popup>
		</view>
		<view class="account" v-if="isPassword">
			<u-popup :show="isPassword" mode="center" @close="closePay">
				<view class="openAccountBox">
					<view class="title">未设置支付密码</view>
					<view class="bottom_btn">
						<view class="btn_item lineBtn" @tap="closePay">取消</view>
						<view class="btn_item" @tap="goPayPassword">去设置</view>
					</view>
				</view>
			</u-popup>
		</view>
		<view class="account" v-if="isBalance">
			<u-popup :show="isBalance" mode="center" @close="closePay">
				<view class="openAccountBox">
					<view class="title1">余额不足</view>
					<view class="bottom_btn">
						<view class="btn_item lineBtn" @tap="closePay">取消</view>
						<view class="btn_item" @tap="goRecharge">去充值</view>
					</view>
				</view>
			</u-popup>
		</view>
		<view class="account" v-if="isSuccess">
			<u-popup :show="isSuccess" mode="center" @close="closePay">
				<view class="openAccountBox">
					<view class="title1">{{tabBoxIndex == 1 ? '下单' : '受让'}}成功</view>
					<view class="bottom_btn">
						<view class="btn_item lineBtn" @tap="closePay">确定</view>
						<view class="btn_item" @tap="goLook">去查看</view>
					</view>
				</view>
			</u-popup>
		</view>
		<view class="account1" v-if="showBox">
			<u-popup :show="showBox" mode="bottom" @close="closePay">
				<view class="openAccountBox1">
					<view class="title1">{{tabBoxIndex == 1 ? '转让' : '受让'}}</view>
					<view class="info">
						<view class="">委托价格：{{price}}{{showFixPriceCoin||'CNY'}}</view>
						<view class="">委托量：{{num||0}}</view>
					</view>
					<view class="info">
						<view class="">委托总额：{{totalAmountOfEntrustment}}{{showFixPriceCoin||'CNY'}}</view>
						<view class="">手续费率：{{tabBoxIndex == 1 ? sellingFeeRatio : buyingFeeRatio }}%</view>
					</view>
					<view class="bottom_btn">
						<view class="btn_item lineBtn" @tap="closePay">取消</view>
						<view class="btn_item" @tap="goShoping">确定</view>
					</view>
				</view>
			</u-popup>
		</view>
		<view class="account1" v-if="isShowSelect">
			<u-popup :show="isShowSelect" mode="bottom" @close="closePay">
				<view class="openAccountBox1 selectBox">
					<view class="title1">转让区</view>
					<scroll-view scroll-y class="selectScrollView">
						<view class="selectList" v-if="selectList.length>0">
							<view class="select-item" v-for="(item,index) in selectList" :key="index"
								@tap="selectBillList(item.coinCode,item.billCode,item.billName)">
								<view class="billCode">{{item.billName}}</view>
								<view class="billCode">（{{item.billCode}}）</view>
							</view>
						</view>
					</scroll-view>
				</view>
			</u-popup>
		</view>
		<view v-if="withdrawalFlag" class="withdrawalModal">
			<view class="withdrawalBox">
				<view class="title">请输入支付密码
					<u-icon name="close" class="closeIcon" @tap="closeWithdrawal" color="#999" size="30upx"></u-icon>
				</view>
				<view class="password">
					<view class="flex">
						<view class="password_num" v-for="(item,index) in miney_list">
							<view class="inputCont" v-if="item.id == index">
								<view v-for="(res,i) in withdrawal.payPsw.length" v-show="i == index">
									<view class="miney_data"></view>
								</view>
							</view>
						</view>
					</view>
					<input v-model="withdrawal.payPsw" maxlength="6" type="number" value="123" @input="input_num">
				</view>
			</view>
		</view>
		<u-keyboard ref="uKeyboard" @confirm="confirmWithdrawal" @change="keyChange" @backspace="backspace"
			:showConfirm="showConfirm" :showCancel="false" confirmText="确定" mode="number" :dotDisabled="true"
			:show="keyboardShow"></u-keyboard>
		<view class="account" v-if="isRevoke">
			<u-popup :show="isRevoke" mode="center" @close="closePay">
				<view class="openAccountBox">
					<view class="title1">确认撤单吗？</view>
					<view class="bottom_btn">
						<view class="btn_item lineBtn" @tap="closePay">取消</view>
						<view class="btn_item" @tap="revokeFn">确定</view>
					</view>
				</view>
			</u-popup>
		</view>
		<mix-loading ref="min_loading"></mix-loading>
	</view>
</template>

<script>
	import _ from "lodash";
	import {
		PATH_IMG,
		BASE_API,
		WEBSOCKET_API
	} from '@/common/config.js';
	import {
		mapState,
		mapMutations
	} from 'vuex';
	import {
		userCancelExEntrust,
		tradesUserEntrustOrder,
		klinevtwoTradingview,
		entrustUserRlist,
		possessCount,
		getSellFeeRate,
		klinevtwoIndex,
		getFeeRate
	} from '@/api/home.js'
	import {
		appfundaccountGetDetail
	} from '@/api/user.js';
	import {
		getUser
	} from '@/api/login.js'
	import {
		throttle
	} from "@/common/util.js"
	import BigNumber from 'bignumber.js'
	export default {
		data() {
			return {
				showConfirm: false,
				currentSelect: null,
				touchNum: 0,
				isScrollY: false,
				tabBoxList: [1],
				isPopupShow: true,
				tabBoxIndex: 1,
				isEnd: true,
				hotNumber: "0", //可用数量
				coldNumber: "0", //冻结数量
				price: "", //委托价格
				num: "", //数量
				buyingFeeRatio: 0, // 受让费率 （受让）
				sellingFeeRatio: 0, // 转让费率 （转让）
				tabBoxList1: [{
						id: 1,
						name: "当前委托"
					},
					{
						id: 2,
						name: "历史委托"
					}
				],
				swiperCurrent: 0,
				billCode: "",
				billName: "",
				coinCode: "",
				curStart:0,
				curLimit:3,
				entrustListPart:[],
				entrustListPart1:[],
				entrustList: [], //委托列表 当前委托
				entrustList1: [], //委托列表 历史委托
				openAccountShow: false, //是否实名
				isPassword: false, //是否设置支付密码
				isBalance: false, //余额是否充足
				userAccount: {},
				userInfo: {},
				goodsDetails: {},
				withdrawalFlag: false,
				keyboardShow: false,
				isSuccess: false,
				showBox: false,
				miney_list: [{
						id: 0,
						name: ''
					},
					{
						id: 1,
						name: ''
					},
					{
						id: 2,
						name: ''
					},
					{
						id: 3,
						name: ''
					},
					{
						id: 4,
						name: ''
					},
					{
						id: 5,
						name: ''
					},
				],
				withdrawal: {
					payPsw: "",
					setFocus: false
				},
				seriesData: [], //k线图对应数据
				socketTask: null,
				is_open_socket: false,
				echartsInfoList: [], //买的价格
				coinCode: '', //代码
				time: "",
				showFixPriceCoin: "",
				priceNewList: [], //最新价列表
				priceNew: 0, //最新价
				buyFeeRate: "", //手续费
				isShowSelect: false,
				selectList: [],
				isRevoke: false, // 撤销委托对应的标识
				cancelOrderInfo: {}, // 撤销委托对应的订单信息
			}
		},
		async onShow() {
			let res = await getUser()
			if (res.status == 200) {
				this.userInfo = res.data.user
			}
			console.log("## onShow ## " + JSON.stringify(this.userInfo))
			let row = await appfundaccountGetDetail();
			if (row.data.success) {
				this.userAccount = row.data.obj;
			}
			this.getBillInfo();
			this.checkShoping();
		},
		 onLoad(options) {
			this.getBillInfoonLoad(options);
		},
		computed: {
			...mapState(["hasLogin", "uerInfo", "h5Data"]),
			timer: {
				get() {
					return this.$store.state.timer;
				},
				set(v) {
					return this.$store.state.timer = v;
				}
			},
			totalAmount: function() {
				if (this.price && this.num) {
					return new BigNumber(this.price).times(this.num).toNumber().toFixed(2);
				} else {
					return 0
				}
			},
			handlingFee: function() {
				if (this.totalAmount) {
					const feeRatio = this.tabBoxIndex == 1 ? this.sellingFeeRatio : this.buyingFeeRatio;
					return new BigNumber(this.totalAmount).times(feeRatio).times(0.01).dp(2, BigNumber.ROUND_CEILING)
						.toNumber();
				} else {
					return 0
				}
			},
			totalAmountOfEntrustment: function() {
				return new BigNumber(this.price).times(this.num).plus(this.handlingFee).dp(2, BigNumber.ROUND_CEILING)
					.toNumber();
			}

		},
		watch: {
			price(newName, oldName) {
				if (this.tabBoxIndex == 1) {
					return
				}
				this.currentSelect = null;
				this.num = 0
			}
		},
		methods: {
			minus(a, b) {
				if (a <= b) {
					return 0
				}
				return new BigNumber(a).minus(b).toNumber();
			},
			changeCurrentSelect(num, percentage) {
				console.log("changeCurrent " + num)
				this.currentSelect = num
				if (this.hotNumber <= 0) {
					return;
				}
				if (this.tabBoxIndex == 1) {
					// 转让
					// 一位小数点
					this.num = new BigNumber(this.hotNumber).times(percentage).decimalPlaces(1, 1).toNumber();
					// 没有小数点
					// this.num = new BigNumber(this.hotNumber).times(percentage).dp(0, 1).toNumber();
				} else if (this.tabBoxIndex == 0) {
					// 受让
					if (this.price == 0) {
						return this.$u.toast('委托价格不能为0');
					}

					const hotMoney = this.userAccount.hotMoney;
					const price = new BigNumber(this.price).times(new BigNumber(this.buyingFeeRatio).times(0.01).plus(1)).toNumber();
					const maxNum = new BigNumber(hotMoney).div(price).dp(1, BigNumber.ROUND_DOWN).toNumber();
					// 一位小数点
					this.num = new BigNumber(maxNum).times(percentage).dp(1, BigNumber.ROUND_DOWN).toNumber();
					// 没有小数点
					// this.num = new BigNumber(maxNum).times(percentage).dp(0, BigNumber.ROUND_DOWN).toNumber();
				}
			},
			maskTouchend(val) {
				this.touchNum++
				setTimeout(() => {
					if (this.touchNum == 1) {
						console.log('单击')
						this.price = val
					}
					if (this.touchNum >= 2) {
						console.log('双击')
						if (val !== '--') {
							this.price = val
						}
					}
					this.touchNum = 0
				}, 250)
			},
			entrustedTransfer(n) {
				this.tabBoxIndex = n;
				this.price = "";
				this.num = "";
				this.currentSelect = null;
				// 查询当前持有积分总数
				if (this.billCode) {
					possessCount({
						billCode: this.billCode
					}).then(res => {
						if (res.data.success) {
							let obj = res.data.obj;
							if (obj == "" || obj == null || obj == "null") {
								this.hotNumber = 0;
								this.coldNumber = 0;
							} else {
								this.hotNumber = res.data.obj.hotNumber;
								this.coldNumber = res.data.obj.coldNumber;
							}

						} else {
							this.hotNumber = 0;
							this.coldNumber = 0;
						}
					})
					// 查询资金余额
					appfundaccountGetDetail().then(res => {
						if (res.data.success) {
							this.userAccount = res.data.obj;
						}
					});
				}
			},
			selectBill() {
				this.getAllBill();
				this.isShowSelect = true;
			},
			statusFilter(type) {
				// status 0未成交　1部分成交　2已完成　 3部分成交已撤销 4已撤销
				if (type == 0) {
					return "未成交"
				} else if (type == 1) {
					return "部分成交"
				} else if (type == 2) {
					return "已完成"
				} else if (type == 3) {
					return "部分成交已撤销"
				} else if (type == 4) {
					return "已撤销"
				}
			},
			selectBillList(coinCode, billCode, billName) {
				this.isShowSelect = false;
				this.coinCode = coinCode;
				this.billCode = billCode;
				this.billName = billName;
				this.entrustList = [];
				this.entrustList1 = [];
				this.swiperCurrent = 0;
				// clearInterval(this.timer);
				this.closeSocket();
				this.getList('current', this.coinCode);
				this.connectSocketInit();
				// 查询当前持有积分总数
				possessCount({
					billCode: this.billCode
				}).then(res => {
					if (res.data.success) {
						let obj = res.data.obj;
						if (obj == "" || obj == null || obj == "null") {
							this.hotNumber = 0;
							this.coldNumber = 0;
						} else {
							this.hotNumber = res.data.obj.hotNumber;
							this.coldNumber = res.data.obj.coldNumber;
						}

					} else {
						this.hotNumber = 0;
						this.coldNumber = 0;
					}
				})
				getFeeRate({
					coinCode: this.billCode,
					fixPriceCoinCode: this.showFixPriceCoin || 'CNY'
				}).then(res => {
					console.log(res, 'res');
					if (res.data.success) {
						const obj = res.data.obj;
						this.buyingFeeRatio = obj.buyingFeeRatio
						this.sellingFeeRatio = obj.sellingFeeRatio
						// this.coldNumber = res.data.obj.coldNumber;
					} else {
						this.buyingFeeRatio = 0;
						this.sellingFeeRatio = 0;
						// this.coldNumber = 0;
					}
				})
			},
			getAllBill() {
				klinevtwoIndex({
					langCode: "zh_CN"
				}).then(res => {
					console.log(res.data[0].data, '0000000')
					let data = [...res.data[0].data];

					this.selectList = data.map(item => {
						item.billCode = item.coinCode.split('_')[0]
						return item
					});
				})
			},
			// 进入这个页面的时候创建websocket连接【整个页面随时使用】(客户端)
			connectSocketInit(data) {
				// this.$refs.min_loading.open('加载中，请稍后！');
				let initObj = data;
				// is_open_socket,init,cmd,coinCode,interval
				// 创建一个this.socketTask对象【发送、接收、关闭socket都由这个对象操作】
				this.socketTask = uni.connectSocket({
					// 【非常重要】必须确保你的服务器是成功的,如果是手机测试千万别使用ws://127.0.0.1:9099【特别容易犯的错误】
					// url: "ws://192.168.63.105:8111/deep", // 你的socket地址
					url: WEBSOCKET_API + "/deep/deep",
					success(res) {
						console.log("websocket连接成功", res);
					},
				});
				// 消息的发送和接收必须在正常连接打开中,才能发送或接收【否则会失败】
				this.socketTask.onOpen((res) => {
					this.is_open_socket = true;
					// 注：只有连接正常打开中 ，才能正常成功发送消息
					// 初始化数据
					this.sendMessage();
					//
					// 注：只有连接正常打开中 ，才能正常收到消息
					this.socketTask.onMessage((res) => {
						this.echartsInfoList = [];
						this.priceNewList = [];
						if (JSON.parse(res.data).deep.asks) {
							let data = JSON.parse(res.data).deep.asks;
							let length = data.length;
							data.forEach((item, index) => {
								if (length > 6) {
									if (index >= (length - 6) && index < length) {
										this.echartsInfoList.push(item);
									} else {
										return
									}
								} else {
									if (index <= 5) {
										this.echartsInfoList.push(item);
									} else {
										return
									}
								}

							})
						}
						if (JSON.parse(res.data).deep.bids) {
							let data2 = JSON.parse(res.data).deep.bids;
							data2.forEach((item, index) => {
								if (index <= 5) {
									this.priceNewList.push(item);
								} else {
									return
								}
							})
						}
						let list = [];
						list = JSON.parse(res.data).buySellData;
						list.forEach(item => {
							let symbolId = item.symbolId.split("_")[0];
							if (symbolId == this.billCode) {
								if (item.payload.priceNew <= 0) {
									this.priceNew = item.payload.priceOpen
								} else {
									this.priceNew = item.payload.priceNew;
								}
							}
						})
						// this.$refs.min_loading.close();

					});
					// this.$refs.min_loading.close();
				})
				// 这里仅是事件监听【如果socket关闭了会执行】
				this.socketTask.onClose(() => {
					// console.log("已经被关闭了");
					// this.$refs.min_loading.close();
				})
			},
			goLook() {
				uni.navigateTo({
					url: "/pages/user/myEntrust"
				})
			},
			// 关闭websocket【离开这个页面的时候执行关闭】
			closeSocket(state, is_open_socket) {
				const _this = this
				this.socketTask.close({
					success(res) {
						console.log("关闭成功", res)
						_this.is_open_socket = false
					},
					fail(err) {
						// console.log("关闭失败", err)
					}
				})
			},
			// 发送消息
			sendMessage() {
				this.socketTask.send({
					data: JSON.stringify({
						"cmd": "trading",
						"coinCode": this.coinCode,
						"type": '0',
						"timeout": 1440
					}),
					async success() {
						// console.log("消息发送成功");
					},
				});
			},
			enterAmountChange(e) { //输入变化
				let value = e.target.value;
				value = value.replace(/[^\d.]/g, ""); //清除“数字”和“.”以外的字符
				value = value.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3'); //只能输入两个小数
				if (value.indexOf(".") < 0 && value != "") {
					//以上已经过滤，此处控制的是如果没有小数点，首位不能为类似于 01、02的金额  
					value = parseFloat(value);
				}
				this.$nextTick(function() {
					this.price = value
				})
			},
			changeCurrent(e) {
				this.swiperCurrent = e;
				this.price = "";
				this.num = "";
				this.entrustList = [];
				this.entrustList1 = [];
				// clearInterval(this.timer);
				// this.getList()
				if (e == 0) {
					if (this.coinCode) {
						this.getList('current', this.coinCode);
					}
				} else {
					if (this.coinCode) {
						this.getList('', this.coinCode);
					}
				}
			},
			// 获取委托历史列表
			getList(current, coinCode) {
				entrustUserRlist({
					type: current,
					coinCode
				}).then(res => {
					if (res.data.success) {
						if (res.data.code == '1') {
							let obj = res.data.obj;
							if (obj == "" || obj == null || obj == "null") {
								this.entrustList = [];
							} else {
								const arr = res.data.obj;
								this.entrustList = arr;
								this.curStart = 0;
								this.curLimit = 3;
								this.entrustListPart = this.entrustList.slice(0,this.curLimit * (1 + this.curStart))
							}
						} else {
							let obj = res.data.obj;
							if (obj == "" || obj == null || obj == "null") {
								this.entrustList1 = [];
							} else {
								this.entrustList1 = res.data.obj
								this.curStart = 0;
								this.curLimit = 3;
								this.entrustListPart1 = this.entrustList1.slice(0,this.curLimit * (1 + this.curStart))
							}
						}
					}
				}).catch(e=>{
					uni.stopPullDownRefresh();
				}).finally(()=>{
					uni.stopPullDownRefresh();
				})
				// this.timer = setInterval(() => {
					// entrustUserRlist({
					// 	type: current,
					// 	coinCode
					// }).then(res => {
					// 	if (res.data.success) {
					// 		if (res.data.code == '1') {
					// 			let obj = res.data.obj;
					// 			if (obj == "" || obj == null || obj == "null") {
					// 				this.entrustList = [];
					// 			} else {
					// 				this.entrustList = res.data.obj
					// 			}
					// 		} else {
					// 			let obj = res.data.obj;
					// 			if (obj == "" || obj == null || obj == "null") {
					// 				this.entrustList1 = [];
					// 			} else {
					// 				this.entrustList1 = res.data.obj
					// 			}
					// 		}
					// 	}
					// })
				// }, 3000)
			},
			// 撤销委托
			revokeFn() {
				let obj = {
					entrustNums: this.cancelOrderInfo.entrustNum,
					entrustPrice: this.cancelOrderInfo.entrustPrice,
					coinCode: this.cancelOrderInfo.coinCode,
					type: this.cancelOrderInfo.type
				}
				console.log("[ xj ] cancelOrderInfo: " + this.cancelOrderInfo);
				console.log("[ xj ] req obj: " + obj);
				this.$refs.min_loading.open("撤单中,请稍后");
				userCancelExEntrust(obj).then(res => {
					console.log("[ xj ] userCancelExEntrust res: " + res.data);
					if (res.data.success) {
						setTimeout(() => {
							this.$refs.min_loading.close();
							this.isRevoke = false;
							this.$u.toast("撤单成功");
							//this.form.offset = 1;
							//this.getList(this.form.offset);
							this.changeCurrent(0); // 直接调用切换函数,以便重新查询数据
							//uni.redirectTo({// 屏蔽,不作跳转
							//    url: "/pages/user/myEntrust"
							//});
						}, 3000)

					} else {
						this.isRevoke = false;
						this.$u.toast(res.data.msg);
					}
				})
			},
			// 撤销的委托项
			cancelOrder(item) {
				this.isRevoke = true;
				this.cancelOrderInfo = item;

				// 这里和"基础交易大厅-撤销委托下单"的接口返回数据不同,接口返回的字段中coinCode没带交易的币类型
				// this.cancelOrderInfo.coinCode = this.cancelOrderInfo.coinCode.split("-")[0]+"_"+this.cancelOrderInfo.coinCode.split("-")[1];
				this.cancelOrderInfo.coinCode += "_" + this.cancelOrderInfo.fixPriceCoinCode;
				console.log("[ xj ] cancel info: " + item);
			},
			// 初始化首页信息
			getBillInfoonLoad(options){
				console.log(options,'拿到信息');
				if(options!=null && options.tabBoxIndex!=null && options.billCode!=null && options.billName!=null && options.coinCode!=null){
					this.tabBoxIndex = options.tabBoxIndex
					this.billCode = options.billCode
					this.billName = options.billName
					this.coinCode = options.coinCode
					this.showFixPriceCoin = options.coinCode.split("_")[1] || 'CNY'
					console.log(this.showFixPriceCoin,"showFixPriceCoin")
				}else{
					klinevtwoTradingview({
						langCode: 'zh_CN'
					}).then(res => {
					
						if (res.data.defaultCoin) {
							console.log(res.data,'88');
							this.billCode = res.data.showCoin;
							this.billName = res.data.name;
							this.coinCode = res.data.defaultCoin;
							this.showFixPriceCoin = res.data.showFixPriceCoin;
							} else {
								return;
							}})
				}
			},
			// 初始化首页信息
			getBillInfo() {
						this.getList('current', this.coinCode);
						this.connectSocketInit();
						// 查询当前持有积分总数
						possessCount({
							billCode: this.billCode
						}).then(res => {
							if (res.data.success) {
								let obj = res.data.obj;
								if (obj == "" || obj == null || obj == "null") {
									this.hotNumber = 0;
									this.coldNumber = 0;
								} else {
									this.hotNumber = res.data.obj.hotNumber;
									this.coldNumber = res.data.obj.coldNumber;
								}
							} else {
								this.hotNumber = 0;
								this.coldNumber = 0;
							}
						})

						getFeeRate({
							coinCode: this.billCode,
							fixPriceCoinCode: this.showFixPriceCoin || 'CNY'
						}).then(res => {
							console.log(res, 'res');
							if (res.data.success) {
								const obj = res.data.obj;
								this.buyingFeeRatio = obj.buyingFeeRatio
								this.sellingFeeRatio = obj.sellingFeeRatio
								// this.coldNumber = res.data.obj.coldNumber;
							} else {
								this.buyFeeRate = 0;
								// this.coldNumber = 0;
								this.buyingFeeRatio = 0;
								this.sellingFeeRatio = 0;
							}
						})
			},
			plus(num) {
				if (num == 1) {
					if (this.hotNumber == '') {
						this.hotNumber = 0;
					}
					this.hotNumber++;
					console.log(this.hotNumber);
				} else {
					if (this.price == '') {
						this.price = 0
					}
					this.price = new BigNumber(this.price).plus(1).toNumber();
				}
			},
			reduce(num) {
				if (num == 1) {
					if (this.hotNumber == '') {
						this.hotNumber = 0;
					}
					if (this.hotNumber <= 0) {
						this.hotNumber = 0
					} else {
						this.hotNumber;
					}
					console.log(this.hotNumber);
				} else {
					if (this.price == '') {
						this.price = 0;
					}
					if (this.price <= 0) {
						this.price = 0.0000
					} else {
						if (this.price >= 1) {
							this.price = new BigNumber(this.price).minus(1).toNumber();
						}
					}
				}
			},
			submitFn() {
				if (this.price <= 0 && this.tabBoxIndex == 0) {
					this.$u.toast('请输入受让价格')
				} else if (this.price <= 0 && this.tabBoxIndex == 1) {
					this.$u.toast('请输入转让价格')
				} else if (this.num <= 0) {
					this.$u.toast('请输入数量')
				}
				// 校验不允许为小数
				// else if (this.num % 1 != 0) {
				// 	this.$u.toast('委托数量应为整数');
				// }
				else if (this.userAccount.hotMoney < this.totalAmountOfEntrustment && this.tabBoxIndex == 0) {
					this.$u.toast('委托总额不能大于当前账号余额');
				} else if (this.num > this.hotNumber && this.tabBoxIndex == 1) {
					this.$u.toast('剩余可用数量不足')
				} else {
					this.showBox = true;
				}
			},
			goShoping() {
				this.showBox = false;
				if (this.userInfo.isRealName == 0) {
					this.openAccountShow = true;
				} else if (this.userInfo.accountPassword == "" || this.userInfo.accountPassword == null) {
					this.isPassword = true;
				} else if ((this.userAccount.hotMoney < this.price * this.num) && this.tabBoxIndex == 0) {
					this.isBalance = true;
				} else {
					this.keyboardShow = true;
					this.withdrawalFlag = true;
				}
			},
			checkShoping() {
				if (this.userInfo.isRealName == 1) {
					this.openAccountShow = false;
				}
				if (this.userInfo.accountPassword) {
					this.isPassword = false;
				}
			},
			goHistoryList() {
				uni.navigateTo({
					url: '/pages/transaction/historyList'
				})
			},
			navTo(url) {
				if (url) {
					uni.navigateTo({
						url
					})
				}
			},
			closeWithdrawal() { //键盘及密码输入框
				this.withdrawal = {
					payPsw: "",
					setFocus: false
				};
				this.keyboardShow = false;
				this.withdrawalFlag = false;
			},
			input_num() { //监听密码变化
				const that = this;
				that.miney_list.forEach((item, index) => {
					for (var i = 0; i < that.withdrawal.payPsw.length; i++) {
						if (i == index) {
							that.miney_list[index].name = '*';
						}
					}
				})
			},
			// confirmWithdrawal: throttle(function() {
			confirmWithdrawal:
				// _.debounce(function() {
				function() {
					this.showConfirm = false;
					if (this.withdrawal.payPsw.length != 6) {
						this.$u.toast('请输入正确的支付密码')
					}
					console.log(this.withdrawal);
					let type = "";
					if (this.tabBoxIndex == 0) {
						type = "1"
					} else {
						type = "2"
					}
					let obj = {
						coinCode: this.coinCode, //转让对代码
						entrustCount: this.num, //限价委托数
						entrustPrice: this.price, //委托价格
						entrustSum: 0, //市价委托数
						entrustWay: "1", //委托方式 1:限价 2:市价
						source: "1", //来源 1:pc 3:app
						type, //1:买，2:卖
						accountPassword: this.hrymd5.md5(this.withdrawal.payPsw)
					}
					tradesUserEntrustOrder(obj).then(res => {
						if (res.data.success) {
							this.closeWithdrawal();
							this.isSuccess = true;
							this.price = "";
							this.num = "";
							let num = 0;
							let timer = setInterval(() => {
								num++;
								if (num > 3) {
									return;
									clearInterval(timer);
								} else {
									// 查询当前持有积分总数
									possessCount({
										billCode: this.billCode
									}).then(res => {
										if (res.data.success) {
											let obj = res.data.obj;
											if (obj == "" || obj == null || obj == "null") {
												this.hotNumber = 0;
												this.coldNumber = 0;
											} else {
												this.hotNumber = res.data.obj.hotNumber;
												this.coldNumber = res.data.obj.coldNumber;
											}
										} else {
											this.hotNumber = 0;
											this.coldNumber = 0;
										}
									})

									appfundaccountGetDetail().then(res => {
										if (res.data.success) {
											this.userAccount = res.data.obj;
										}
									});
								}
							}, 2000)
							// this.$u.toast(res.data.msg);
							// setTimeout(() =>{
							// 	this.back();
							// },1500)
						} else {
							this.closeWithdrawal();
							this.$u.toast(res.data.msg);
						}
					})
					// this.keyboardShow = false;
					// this.withdrawalFlag = false;
					// }, 1000),
				},
			keyChange(val) { // 按键被点击
				this.showConfirm = true;
				if (this.withdrawal.payPsw.length <= 5) {
					this.withdrawal.payPsw += val;
				}
				console.log(this.withdrawal.payPsw)
			},
			backspace() { // 退格键被点击
				// 删除value的最后一个字符
				if (this.withdrawal.payPsw.length) this.withdrawal.payPsw = this.withdrawal.payPsw.substr(0, this
					.withdrawal.payPsw.length - 1);
			},
			closePay() {
				this.openAccountShow = false;
				this.isPassword = false;
				this.isBalance = false;
				this.isSuccess = false;
				this.showBox = false;
				this.isShowSelect = false;
				this.isRevoke = false; // 撤销委托对应的标识
			},
			// 去认证
			goAccount() {
				uni.navigateTo({
					url: '/pages/openAccount/index'
				})
			},
			// 设置支付密码
			goPayPassword() {
				uni.navigateTo({
					url: '/pages/setting/payPassword'
				})
			},
			// 余额不足去充值
			goRecharge() {
				uni.navigateTo({
					url: '/pages/user/recharge'
				})
			},
			goStatusics() {
				if (this.coinCode) {
					uni.navigateTo({
						url: '/pages/transaction/statistics?coinCode=' + this.coinCode + '&billCode=' + this
							.billCode
					})
				} else {
					this.$u.toast('暂无转让信息');
				}

			}
		},
		onHide() {
			this.closeSocket();
			this.$store.dispatch("clearIntervalFn");
			clearInterval(this.timer);
		},
		onUnload() {
			this.closeSocket();
			this.$store.dispatch("clearIntervalFn");
			clearInterval(this.timer);
		},
		onPullDownRefresh(){
			if (this.swiperCurrent == 0) {
				if (this.coinCode) {
					this.getList('current', this.coinCode);
				}
			} else {
				if (this.coinCode) {
					this.getList('', this.coinCode);
				}
			}
		},
		onReachBottom() {
			console.log("触底了...")
			this.curStart ++;
			if (this.swiperCurrent == 0) {
				this.entrustListPart = this.entrustList.slice(0,this.curLimit * (1 + this.curStart))
			} else {
				this.entrustListPart1 = this.entrustList1.slice(0,this.curLimit * (1 + this.curStart))
			}
		}
	}
</script>
<style scoped lang="less">
	page {
		width: 100%;
		min-height: 100%;
		background-color: #fff;
		// content-visibility: auto;
		// contain-intrinsic-size: 1px 5000px;
	}

	.container {
		width: 100%;
		height: 100%;
		padding: 120upx 30upx 0;

		.homeBg {
			width: 100%;
			height: 120upx;
			background: url(../../static/login/bg.png) no-repeat top center;
			background-size: 100% 500%;
			position: fixed;
			top: 0;
			left: 0;
			display: flex;
			align-items: center;
			justify-content: center;
			z-index: 99;

			.title {
				font-size: 32upx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #FFFFFF;
			}

			.searchIcon {
				width: 44upx;
				position: absolute;
				right: 42upx;
				top: 50%;
				transform: translateY(-50%);
			}
		}

		.popupBox {
			width: 100%;
			height: 84upx;
			position: fixed;
			bottom: 118upx;
			left: 0;
			padding: 0 40upx;
			z-index: 99;

			>view {
				width: 100%;
				height: 100%;
				display: flex;
				align-items: center;
				justify-content: space-between;
				background-color: #FCCC35;
				border-radius: 10upx;
				font-size: 24upx;
				padding: 0 30upx;
				color: #151515;

				.btns {
					display: flex;
					align-items: center;
					font-size: 0;

					.navigator {
						width: 130upx;
						height: 55upx;
						background: #191919;
						border-radius: 28upx;
						font-size: 24upx;
						font-weight: 400;
						color: #FCCC35;
						line-height: 55upx;
						text-align: center;
						margin-right: 10upx;
					}
				}
			}
		}

		.transaction-info {
			display: flex;
			justify-content: space-between;
			padding-top: 30upx;
			font-size: 30upx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #333333;

			.info-left {
				flex: 1;
				max-width: 330upx;

				.ball-name {
					width: 100%;
					white-space: nowrap;
					// text-overflow: ellipsis;
					overflow: scroll;
				}

				.submit-form {
					width: 100%;
					display: flex;
					margin: 18upx 0 20upx;

					.submit-btn {
						flex: 1;
						display: flex;
						align-items: center;
						justify-content: center;
						font-size: 28upx;
						font-family: PingFang SC;
						font-weight: 500;
						color: #FFFFFF;
						height: 70upx;
					}

					.btn1 {
						background: url(@/static/common/entrust.png) no-repeat center center;
						background-size: 100% 100%;
					}

					.btn2 {
						background: url(@/static/common/entrust2.png) no-repeat center center;
						background-size: 100% 100%;
					}
				}

				.label {
					font-size: 15px;
					font-family: PingFang SC;
					font-weight: 400;
					color: #4C4C4C;
					margin: 30upx 0 20upx;
				}

				.label-input {
					width: 100%;
					height: 60upx;
					background: #F7F7F7;
					border-radius: 4upx;
					display: flex;
					align-items: center;
					justify-content: space-between;
					overflow: scroll;
					white-space: nowrap;

					.left-input {
						flex: 3;

						.input-box,
						.inputStyle {
							font-size: 24upx;
							font-family: PingFang SC;
							font-weight: 700;
							color: #080808;
							padding: 0 10upx;
						}
					}

					.input-view {
						display: flex;
						align-items: center;
						justify-content: space-between;
						font-size: 24upx;
						font-family: PingFang SC;
						font-weight: 400;
						color: #C3C3C3;
						padding: 0 10upx;
					}

					.jian {
						flex: 1;
						display: flex;
						align-items: center;
						justify-content: center;
					}

					.img {
						width: 18upx;
						display: block;
					}

					.jia {
						flex: 1;
						display: flex;
						align-items: center;
						justify-content: center;
					}
				}

				.sales-total-box {
					font-size: 20upx;
					color: #909399;

					.totalAmount {
						padding-top: 10upx;
						display: flex;
						justify-content: space-between;
					}

					.handlingFee {
						padding-top: 10upx;
						display: flex;
						justify-content: space-between;
					}
				}

				.submit-btn1 {
					width: 100%;
					margin: 30upx 0 80upx;
					height: 70upx;
					background: #039E04;
					border-radius: 4upx;
					display: flex;
					align-items: center;
					justify-content: center;
					font-size: 30upx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #FFFFFF;
				}

				.submit-btn2 {
					width: 100%;
					margin: 30upx 0 80upx;
					height: 70upx;
					background: #c20707;
					border-radius: 4upx;
					display: flex;
					align-items: center;
					justify-content: center;
					font-size: 30upx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #FFFFFF;
				}
			}

			.info-right {
				flex: 1;
				padding-left: 36upx;

				.header {
					width: 100%;
					display: flex;
					align-items: center;
					justify-content: center;

					&>view {
						flex: 1;
						display: flex;
						align-items: center;
						justify-content: center;
					}
				}

				.list-item {
					display: flex;

					&>view {
						flex: 1;
						display: flex;
						align-items: center;
						justify-content: center;
						line-height: 76upx;
						font-size: 26upx;
						font-family: PingFang SC;
						font-weight: 500;
						color: #333;
					}
				}

				.noData {
					margin-top: 300upx;
				}
			}
		}

		.tabBox {
			width: 100%;
			margin-top: 40upx;
			padding-bottom: 20upx;
			border-bottom: 1px solid #E7E7E7;
			display: flex;
			align-items: center;
			justify-content: space-between;
			font-size: 24upx;
			font-family: PingFang SC;
			font-weight: 400;
			color: #000000;

			&>view {
				display: flex;
				align-items: center;
			}

			.activeClass {
				font-size: 30upx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #333333;
				margin-right: 30upx;
				transition: all .5;
			}

			.defaultClass {
				font-size: 26upx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #AAAAAA;
				margin-right: 30upx;
				transition: all .5;
			}
		}

		.goods_list {
			width: 100%;
			// height: calc(100% - 30upx);

			.listCentent {
				width: 100%;
				padding: 20upx 0 120upx;

				.msg {
					text-align: center;
					font-size: 24upx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #BCBCBC;
					margin-top: 30upx;
					display: flex;
					align-items: center;
					justify-content: center;

					.text {
						margin: 0 20upx;
					}

					.left-line {
						width: 100upx;
					}

					.right-line {
						width: 100upx;
						transform: rotate(-180deg);
					}

					// padding-bottom: 100upx;
				}

				.list-item {
					border: 2upx solid rgba(51, 51, 51, 0.1000);
					border-radius: 10upx;
					margin-bottom: 20upx;
					font-size: 26upx;
					position: relative;

					.left-line{
						width: 8upx;
						height: 40upx;
						position: absolute;
						left: 0;
						top: 30upx;
						background-color: #039E04;
					}
					
					.one{
						background-color: #C20707;
					}

					.flex {
						display: flex;
						align-items: center;
						justify-content: space-between;
						line-height: 70upx;
						padding: 0 30upx;
					}

					.date {
						border-top: 2upx solid rgba(51, 51, 51, 0.1000);
						padding: 0 30upx;
						line-height: 70upx;
					}

					.cancelOrder {
						position: absolute;
						right: 30upx;
						bottom: 9upx;
						width: 100upx;
						display: flex;
						align-items: center;
						justify-content: center;
						background-color: #cea539;
						color: #fff;
						padding: 10upx 10upx;
						border-radius: 8upx;
					}
				}

			}

		}

		.noListBox {
			text-align: center;

			.noData {
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: center;
				flex-direction: column;
				margin-top: 200upx;
				margin-bottom: 200upx;

				.noDataImg {
					width: 316upx;
					height: 126upx;
				}

				.text {
					font-size: 26upx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #B0B5BC;
					line-height: 92upx;
				}
			}
		}

		.account,
		.account1 {
			/deep/.u-popup__content {
				width: 633upx;
				height: auto;
				background: #fff;
				border-radius: 20upx;
				overflow: hidden;

				.header {
					height: 48upx;
					// background: url('../../static/user/border.png');
					// background-size: 100% 100%;
					text-align: center;
					font-size: 32upx;
					font-family: Source Han Sans CN;
					font-weight: 500;
					color: #FFFFFF;
					margin: 34upx 38upx 0 38upx;
				}

			}

			/deep/.u-button--info {
				border-color: transparent;
			}

			.openAccountBox {
				background: #FFFFFF;
				text-align: center;
				font-size: 32upx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #333333;
				padding-top: 50upx;

				.title {
					padding-bottom: 50upx;
				}

				.title1 {
					padding: 0 50upx 50upx;
				}

				.bottom_btn {
					width: 100%;
					font-size: 14px;
					font-family: PingFang SC;
					font-weight: 500;
					color: #C09B3A;
					display: flex;
					align-items: center;
					justify-content: center;

					box-shadow: 0px 0px 1px 0px #BCBCBC;

					.btn_item {
						flex: 1;
						display: flex;
						align-items: center;
						justify-content: center;
						height: 88upx;
					}

					.lineBtn {
						box-shadow: 1upx 0px 0px 0px #BCBCBC;
					}
				}
			}

		}

		.selectBox {
			width: 100%;

			.selectScrollView {
				width: 100%;
				overflow-y: scroll;
				max-height: 500upx;
			}

			.selectList {
				width: 100%;
				display: flex;
				justify-content: space-between;
				flex-wrap: wrap;
				padding-top: 30upx;

				.select-item {
					width: 49%;
					display: flex;
					align-items: center;
					justify-content: center;
					flex-direction: column;
					font-size: 24upx;
					padding-bottom: 20upx;

					.billCode {
						width: 100%;
						text-overflow: ellipsis;
						overflow: hidden;
						white-space: nowrap;
					}
				}
			}
		}

		.account1 {
			/deep/.u-popup__content {
				width: 100%;
				height: auto;
				background: #fff;
				border-radius: 20upx 20upx 0 0;
				overflow: hidden;

			}

			/deep/.u-button--info {
				border-color: transparent;
			}

			.openAccountBox1 {
				width: 100%;
				text-align: center;
				padding: 50upx 60upx;

				.info {
					display: flex;
					align-items: center;
					justify-content: space-between;
					font-size: 24upx;
					line-height: 60upx;

					&>view {
						text-align: left;
					}
				}

				.bottom_btn {
					width: 100%;
					font-size: 14px;
					font-family: PingFang SC;
					font-weight: 500;
					color: #C09B3A;
					display: flex;
					align-items: center;
					justify-content: center;
					margin-top: 20upx;

					box-shadow: 0px 0px 1px 0px #BCBCBC;

					.btn_item {
						flex: 1;
						display: flex;
						align-items: center;
						justify-content: center;
						height: 60upx;
					}

					.lineBtn {
						box-shadow: 1upx 0px 0px 0px #BCBCBC;
					}
				}
			}
		}

		.withdrawalModal {
			position: fixed;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			z-index: 10071;
			background-color: rgba(0, 0, 0, .2);

			.withdrawalBox {
				width: 600upx;
				padding: 70upx 40upx;
				color: #333;
				background-color: #fff;
				border-radius: 10upx;
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translateX(-50%);
				margin-top: -400upx;

				.password {
					width: 100%;
					height: 80upx;
					position: relative;

					input {
						width: 100%;
						height: 100%;
						position: absolute;
						top: 0;
						left: 0;
						opacity: 0;
					}

					.flex {
						display: flex;
						align-items: center;
						justify-content: space-between;

						.password_num {
							width: 80upx;
							height: 80upx;
							line-height: 80upx;
							display: flex;
							align-items: center;
							justify-content: center;
							background-color: #999;

							.inputCont {
								display: flex;
								align-items: center;

								.miney_data {
									width: 20upx;
									height: 20upx;
									background-color: #000000;
									border-radius: 50%;
								}
							}

						}
					}
				}

				.password::after {
					content: "";
					display: block;
					width: 100%;
					height: 100%;
					position: absolute;
					top: 0;
					left: 0;
					z-index: 1;
				}

				.title {
					color: #333;
					font-size: 30upx;
					line-height: 30upx;
					font-weight: 800;
					text-align: center;
					padding-bottom: 145upx;
					position: relative;

					.closeIcon {
						position: absolute;
						top: -40upx;
						right: 0;
					}
				}
			}
		}
	}
</style>
